import React from 'react';
import { Outlet } from 'react-router-dom';
import { Layout } from 'antd';
import TopNavigation from '../components/TopNavigation';

const { Header, Content } = Layout;

const MainLayout: React.FC = () => {
  return (
    <Layout style={{ minHeight: '100vh' }}>
      {/* Header - 顶部导航栏 */}
      <Header style={{ 
        position: 'fixed',
        top: 0,
        zIndex: 1000,
        width: '100%',
        padding: 0,
        height: 50,
        lineHeight: '50px',
        background: '#fff'
      }}>
        <TopNavigation />
      </Header>

      {/* Content - 主内容区 */}
      <Content style={{ 
        marginTop: 50, // 为固定Header留出空间
        minHeight: 'calc(100vh - 50px)',
        background: '#f5f5f5'
      }}>
        <Outlet />
      </Content>
    </Layout>
  );
};

export default MainLayout; 